//
//  FontSettingsView.swift
//  WYYao
//
//  Created by wangcl on 2024/9/11.
//

import SwiftUI

struct FontSettingsView: View {
    @State var fontName = Settings.shared.fontName
    @State var fontSize = Settings.shared.fontSize
    @State var textColor = Settings.shared.textColor
    @State var backgroundColor = Settings.shared.backgroundColor
    var body: some View {
        Form(content: {
            Section {
                Picker("Font Name", selection: $fontName) {
                    ForEach(FontManager.shared.fontNames, id: \.self) { name in
                        Text(name).font(FontManager.font(for: name))
                    }
                }
                Picker("Font Size", selection: $fontSize) {
                    ForEach(FontManager.shared.fontSizes, id: \.self) { size in
                        Text("\(Int(size))").font(.system(size: fontSize))
                    }
                }
                ColorPicker("Text Color", selection: $textColor)
                ColorPicker("Background Color",selection: $backgroundColor)
            }
            Section(header: Text("Preview"),content:{
                Text("ABCDEFGHIJKLM NOPQRSTUVWXYZ abcdefghijklm nopqrstuvwxyz 1234567890")
                    .font(.custom(fontName, size: fontSize))
                    .cl_foregroundColor(textColor)
                    .background(backgroundColor)
            })
        }).navigationTitle("Font")
            .navigationBarTitleDisplayMode(.inline)
            .toolbar(content: {
                ToolbarItem(placement: .navigationBarTrailing) {
                    Button("Reset"){
                        fontName = FontManager.defaultFontName
                        fontSize = FontManager.defaultFontSize
                        textColor = FontManager.defaultTextColor
                        backgroundColor = FontManager.defaultBackgroundColor
                    }
                }
            }).onChange(of: fontName) {
                Settings.shared.fontName = $0
            }.onChange(of: fontSize) {
                Settings.shared.fontSize = $0
            }.onChange(of: textColor) {
                Settings.shared.textColor = $0
            }.onChange(of: backgroundColor) {
                Settings.shared.backgroundColor = $0
            }
    }
}

#Preview {
    NavigationView{
        FontSettingsView()
    }
    
}
